<template>
    <div class="carousel-container">
        <div class="carousel-content">
            <div class="carousel-item" v-for="(item, i) in list" :style="{ '--s': i + 1, backgroundImage: 'url(' + item + ')' }">
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name: "Carousel",
    props: ["carouselList"],
    data() {
        return {
            list: [
                "/img/style/waterfall.jpg",
                "/img/style/simiao.jpg",
                "/img/style/zhongta.jpg",
            ],
        }
    },
    computed: {},
    methods: {
    },
    created() {
        if (this.$props.carouselList) {
            this.list = this.$props.carouselList;
        }
    },
    mounted() {
    }
}
</script>

<style>
@import url("@/assets/css/style/carousel.css");
</style>